<!doctype html>
<html lang="zh">

<head>
    <meta charset="UTF-8">
    <meta name="viewport"
        content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta name="keywords" content="星时代曹波涛" />
    <%- include("layout/css_includ.ejs") %>
        <title>文章列表</title>
</head>

<body>
    <div class="container-fluid bg-nav">
        <div class="container">
            <div class="row">
                <div class="col-12 bg-nav">
                    <%- include("layout/nav.ejs") %>
                </div>
            </div>
        </div>
    </div>
    <!--头部结束-->
    <!--正文-->
    <div class="container">
        <div class="row">
            <!-- 可变区域-->
            <div class="col-12 bg-white my-3">
                <div class="container-fluid">
                    <div class="row mt-3 w-100 p-0 m-0">
                        <div class="col-12 p-0 m-auto">
                            <nav aria-label="breadcrumb">
                                <ol class="breadcrumb">
                                    <li class="breadcrumb-item"><a href="/">首页</a></li>
                                    <li class="breadcrumb-item active" aria-current="/list">文章</li>
                                </ol>
                            </nav>
                        </div>
                    </div>

                    <!--博客-->
                    <div class="row mt-0 mb-5 px-3">
                        <div class="col-12 px-0">
                            <% data.forEach(element=> { %>
                                <div class="list-group mx-0 my-2 article-list-hot">
                                    <a href="javascript:void(0)" onclick="showArticleById('<%=element.id %>')"
                                        class="list-group-item list-group-item-action m-0 overflow-hidden">
                                        <div class="row" style="min-height: 120px;">
                                            <div class="col-sm-12 col-md-2 col-lg-2 p-0 m-0 overflow-hidden"
                                                style="height: 120px;">
                                                <img src="<%= element.cover %>" class="d-block p-0 m-0 fd"
                                                    style="width: 100%;height: 100%;">
                                            </div>
                                            <div class="col-sm-12 col-md-10  col-lg-10"
                                                style="position: relative;height: inherit;">
                                                <% if (new Date(element.created).getTime() + 1000*60*60*24*5> new
                                                    Date().getTime()) { %>
                                                    <span class="badge badge-info float-right">新</span>
                                                    <% } %>
                                                        <% if (element.views>50) { %>
                                                            <span class="badge badge-danger float-right mr-2">热</span>
                                                            <% } %>
                                                                <h5 class="mb-2"
                                                                    style="color: #34495e;font-size: 18px;">
                                                                    <%= element.title %>
                                                                </h5>
                                                                <p style="color: #888;font-size: 12px;"
                                                                    class="mb-0 sm text-left">浏览次数:<%= element.views %>
                                                                        发布时间:<%=element.created %>
                                                                </p>
                                                                <p class="my-1" style="font-size: 12px;">
                                                                    <%= element.content.substring(0,150).concat("······")
                                                                        %>
                                                                </p>

                                            </div>
                                        </div>
                                    </a>
                                </div>
                                <% }) %>
                        </div>
                    </div>
                </div>
                <div class="row mt-5 mb-5 mx-2">
                    <div class="col-12">
                        <ul class="pagination d-flex justify-content-end">
                            <li class="page-item">
                                <a class="page-link"
                                    href="/list/<%=currentPage==1?currentPage:currentPage-1%>/<%=pageSize %>">上一页</a>
                            </li>
                            <li class="page-item"><a class="page-link" href="#">
                                   第 <%=currentPage%> 页
                                </a>
                            </li>
                            <li class="page-item"><a class="page-link"
                                    href="/list/<%=parseInt(currentPage)+1%>/<%=pageSize %>">下一页</a></li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
        <!-- 可变区域结束-->
    </div>

    <!--正文结束-->
    <%- include("layout/foot.ejs") %>
        <%- include("layout/js_includ.ejs") %>
</body>

</html>